<template>
    <div class="preson-page">
        <div class="container">
            <div class="item">
                <div class="left">类型</div>
                <div class="center">得分</div>
                <div class="right">打分人数</div>
            </div>
            <div class="item" v-for="(item, index) in data" 
                :key="index">
                <div class="left">{{item.scoredType}}</div>
                <div class="center">{{item.score}}</div>
                <div class="right">{{item.count}}</div>
            </div>
        </div>
    </div>
</template>
<script>
import { getUserScore } from '@/services';

export default {
    name: 'Person',
    data(){
        return {
            data: [],
        }
    },
    mounted(){
        this.getScore();
    },
    methods: {
        async getScore(){
            let res = await getUserScore();
            if(res.responseObject){
                let _data = res.responseObject;
                this.data = _data;
            }
        },
        getType(value){
            if(value === 'deptName') return '部门';
            else if(value === 'name') return '姓名';
            else if(value === 'peersScore') return '同事打分';
            else if(value === 'selfScore') return '自我打分';
            else if(value === 'subordinateScore') return '下属打分';
            else if(value === 'superiorScore') return '上级打分';
            else if(value === 'totalScore') return '总分';
        }
    }
}
</script>
<style lang="less" scoped>
@color: #bfbfbf;
    .preson-page{
        margin: 20px 50px 0;
        .container{
            width: 400px;
            margin-bottom: 20px;
            border-top: 1px solid @color;
            border-left: 1px solid @color;
            .item{
                width: 100%;
                display: flex;
                line-height: 40px;
                .left, .right, .center{
                    flex: 1;
                    text-align: center;
                    border-right: 1px solid @color;
                    border-bottom: 1px solid @color;
                }
            }
            .item:first-child{
                font-weight: bold;
            }
        }
    }
</style>